<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>医院病区急救车物资综合管理系统</title>
    <link href="../lib/bootstrap.min.css" rel="stylesheet">
    <link href="../lib/fontawesome.min.css" rel="stylesheet">
    <link href="../css/index.css" rel="stylesheet">
    <script src="../lib/chart.js"></script>
    <script src="../lib/jsQR.min.js"></script>
    <script src="../lib/qrcode.min.js"></script>
    <script src="../lib/JsBarcode.all.min.js"></script>
    <script src="../js/mock_data.js"></script>

</head>
<body>
    <!-- Loading overlay -->
    <div class="loading-overlay" id="loadingOverlay">
        <div class="loading-spinner"></div>
    </div>

    <!-- Main content area -->
    <div class="container-fluid" id="mainContent">
        <div class="row">
            <!-- Sidebar -->
            <div class="col-md-2 sidebar">
                <div class="sidebar-header">
                    <h3>医院病区急救车物资管理系统</h3>
                </div>
                <ul class="nav flex-column">
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="dashboard">
                            <i class="fas fa-home me-2"></i>首页
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="ambulance">
                            <i class="fas fa-ambulance me-2"></i>急救车管理
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="inventory">
                            <i class="fas fa-boxes me-2"></i>物资管理
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="usage-records">
                            <i class="fas fa-history me-2"></i>物资使用记录
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="material-usage-history">
                            <i class="fas fa-archive me-2"></i>物资使用历史
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="abnormal-menu" href="#" data-page="material-exception-report">
                            <i class="fas fa-exclamation-triangle me-2"></i>物资异常
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="material-expiry-alerts">
                            <i class="fas fa-bell me-2"></i>物资有效期预警
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="material-inventory-alerts">
                            <i class="fas fa-warehouse me-2"></i>物资库存预警
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="material-data-query">
                            <i class="fas fa-info-circle me-2"></i>物资资料查询
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="statistics">
                            <i class="fas fa-chart-bar me-2"></i>统计分析
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" data-page="system">
                            <i class="fas fa-cog me-2"></i>系统设置
                        </a>
                    </li>
                </ul>
            </div>

            <!-- Main content area -->
            <div class="col-md-10 main-content">
                <div class="content-header">
                    <h3 id="pageTitle">
                        <i class="fas fa-home me-2"></i>首页
                    </h3>
                    <div class="user-info">
                        <span id="currentUser">
                            <i class="fas fa-user-circle me-2"></i>
                        </span>
                        <button class="btn btn-outline-danger btn-sm" id="logoutBtn">
                            <i class="fas fa-sign-out-alt me-2"></i>退出登录
                        </button>
                    </div>
                </div>
                <div id="mainHomeArea">
                  <div id="menuCards" class="menu-cards"></div>
                  <div id="contentArea"></div>
                </div>
            </div>
        </div>
    </div>

    <!-- 提示信息容器 -->
    <div class="toast-container"></div>

    <div class="footer">&copy; 2025 急救车物资管理系统</div>
    <script src="../lib/bootstrap.bundle.min.js"></script>
    <script>
      /**
       * 模拟用户数据 - 系统管理员、物资管理人员、医护人员
       * 用于演示系统的用户管理和权限控制功能
       * 包含用户基本信息、登录凭据、角色权限等
       */
      window.mockUsers = [
        { 
          username: 'xiangweikun  ',           // 用户名
          password: 'xiangweikun123',          // 密码
          name: '向炜坤',                      // 真实姓名
          role: 'admin',                       // 用户角色：admin-系统管理员
          department: '系统管理部',            // 所属部门
          email: 'xiangweikun@address.com'     // 邮箱地址
        },
        { 
          username: 'hefengchun',              // 用户名
          password: 'hefengchun123',           // 密码
          name: '何逢春',                      // 真实姓名
          role: 'admin',                       // 用户角色：admin-系统管理员
          department: '系统管理部',            // 所属部门
          email: 'hefengchun@address.com'      // 邮箱地址
        },
        { 
          username: 'tangguiping',             // 用户名
          password: 'tangguiping123',          // 密码
          name: '唐贵平',                      // 真实姓名
          role: 'manager',                     // 用户角色：manager-物资管理人员
          department: '物资管理部',            // 所属部门
          email: 'tangguiping@address.com'     // 邮箱地址
        },
        { 
          username: 'xubaoshan',               // 用户名
          password: 'xubaoshan123',            // 密码
          name: '徐宝山',                      // 真实姓名
          role: 'doctor',                      // 用户角色：doctor-医护人员
          department: '急诊科',                // 所属部门
          email: 'xubaoshan@address.com'       // 邮箱地址
        }
      ];
    </script>
    <script src="../js/index.js"></script>
    <script>
      console.log('mockUsers:', window.mockUsers);
      console.log('lastLoginUser:', localStorage.getItem('lastLoginUser'));
      console.log('userInfoSpan:', document.getElementById('currentUser'));
    </script>
</body>
</html> 
